<!DOCTYPE html>
<html>

<head>
  <title>红喇叭智慧小店</title>
  <meta charset="utf-8">
  <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
  <meta content="yes" name="apple-mobile-web-app-capable">
  <meta content="black" name="apple-mobile-web-app-status-bar-style">
  <meta content="telephone=no" name="format-detection">
  <meta content="email=no" name="format-detection">
  <link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_975107_vhax2rne4oe.css">
  <link rel="stylesheet" type="text/css" href="../css/base.css">
  <link rel="stylesheet" type="text/css" href="../css/animate.css">
  <link rel="stylesheet" type="text/css" href="css/style.css">
  <script src="../js/jquery.js"></script>
  <script src="../js/flexible.js"></script>
  <link rel="stylesheet" type="text/css" href="css/swiper.min.css">
  <script src="js/swiper.min.js"></script>
  <style>
body{ padding-bottom: 1rem;}
.swiper-container{width:100%;height:100%}
.swiper-slide{text-align:center;font-size:18px;background:#fff;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center}
.swiper-slide img{width:100%}
.swiper-pagination-bullet{background:#666;text-indent:99px;width:7px;height:2px;opacity:.5;margin:0 .1rem;outline:0;display:inline-block;border-radius:0}
.swiper-pagination-white .swiper-pagination-bullet-active{height:2px;background:#818181}
.swiper-pagination-bullet-active{background:#e71a41}
.bbtit {
    padding: .2rem;
    padding-bottom: 0;
    font-size: .36rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bbtit span:before {
    content: "";
    width:.61rem;
    height:.32rem;
    display: inline-block;
    background: url('images/tit_left.png') no-repeat;
    background-size: 100%;
    margin-right: .1rem;
}
.bbtit span:after {
    content: "";
    width: .61rem;
    height:.32rem;
    display: inline-block;
    background: url('images/tit_right.png') no-repeat;
    background-size: 100%;
    margin-left: .1rem;
}
.bbtit img{width: .4rem;height: .4rem; margin-right: .1rem;}
.tjbox{border-radius: .3rem; position: relative;}
.tjlsit{ padding: 0 .2rem;}
.tjlsit .right .name{color:#232326; margin-bottom: .2rem;font-weight: normal;}
.tjlsit .right .box1{ color: #f23030;font-size: .3rem;}
.tjlsit ul{ padding: 0 .2rem;}
.tjlsit ul li:last-child:after{ border-bottom: none;}
.footer{position: fixed;bottom: 0;left: 0;right: 0;width: 100%;display: flex;align-items: center; z-index: 15; height: 1rem; background-color: hsla(0,0%,100%,.95);}
.footer .right{flex: 1; display: flex;align-items: center;justify-content:center;font-size: .36rem; color: #fff; background: #f23030;height: 100%;}

.footer .left{display: flex; color: #666; justify-content:space-around;width: 30%; text-align: center; padding: 0 .1rem;}
.footer .left a{color: #666;width: 50%;font-size: .24rem;}
.footer .left img{width: .5rem; height: .5rem;display: inline-block;}
.footer .left span{display: block; line-height: 1.3}
.footer .left span i{font-size: .4rem;}
  </style>
</head>

<body>
    <div class="swiper-container">
        <div class="swiper-wrapper">
          <div class="swiper-slide"><img src="images/banner01.jpg"></div>
          <div class="swiper-slide"><img src="images/banner02.jpg"></div>
        </div>
        <div class="swiper-pagination"></div>
      </div>
      <div class="tjbox">
          <div class="bbtit"><span>每日推荐</span></div>
            <div class="block_item tjlsit">
                <ul class="ul_list">
                    <li class="bdr-b">
                        <div class="left">
                            <img src="images/goods01.jpg">
                        </div>
                        <div class="right">
                            <div class="name line-clamp-2">丰扬 25克每日坚果混合坚果成人款 7袋装/30袋装</div>
                            <div class="box1">￥3.11</div>
                        </div>
                    </li>
                    <li class="bdr-b">
                        <div class="left">
                            <img src="images/goods02.jpg">
                        </div>
                        <div class="right">
                            <div class="name line-clamp-2">味滋源 巴旦木仁办公室零食坚果特产扁桃仁 208g*2</div>
                            <div class="box1">￥3.11</div>
                        </div>
                    </li>
                    <li class="bdr-b">
                        <div class="left">
                            <img src="images/goods01.jpg">
                        </div>
                        <div class="right">
                            <div class="name line-clamp-2">丰扬 25克每日坚果混合坚果成人款 7袋装/30袋装</div>
                            <div class="box1">￥3.11</div>
                        </div>
                    </li>
                    <li class="bdr-b">
                        <div class="left">
                            <img src="images/goods02.jpg">
                        </div>
                        <div class="right">
                            <div class="name line-clamp-2">味滋源 巴旦木仁办公室零食坚果特产扁桃仁 208g*2</div>
                            <div class="box1">￥3.11</div>
                        </div>
                    </li>
                    <li class="bdr-b">
                        <div class="left">
                            <img src="images/goods01.jpg">
                        </div>
                        <div class="right">
                            <div class="name line-clamp-2">丰扬 25克每日坚果混合坚果成人款 7袋装/30袋装</div>
                            <div class="box1">￥3.11</div>
                        </div>
                    </li>
                    <li class="bdr-b">
                        <div class="left">
                            <img src="images/goods02.jpg">
                        </div>
                        <div class="right">
                            <div class="name line-clamp-2">味滋源 巴旦木仁办公室零食坚果特产扁桃仁 208g*2</div>
                            <div class="box1">￥3.11</div>
                        </div>
                    </li>
                </ul>
            </div>
      </div>
      <div class="footer">
         <div class="left">
           <a href="wode.html">
            <span>
                    <i class="iconfont icon-wode"></i>
              </span>
              <span>我的</span>
          </a>
          <a href="tel:400-665-1798">
              <span>
                    <i class="iconfont icon-kefu"></i>
                </span>
                <span>客服</span>
            </a>
         </div>
         <div class="right">
           <span>正在购物中</span>
          </div>
      </div>
</body>
      <!-- Initialize Swiper -->
      <script>
          var swiper = new Swiper('.swiper-container', {
            pagination: {
              el: '.swiper-pagination',
            },
          });
        </script>
</html>